{% load avatar_tags i18n %}

<script type="text/template" id="user-info-popup-tmpl">
    <div class="outer-caret up-outer-caret"><div class="inner-caret"></div></div>
    <div class="sf-popover-con">
        <div class="item ovhd">
            {% avatar request.user 36 %}
            <div class="txt">
                <%- app.pageOptions.name %>
            </div>
        </div>
        <div class="loading-icon loading-tip"></div>
        <p class="error alc hide"></p>
        <div id="space-traffic" class="hide"></div>
        <a class="item" href="{{ SITE_ROOT }}profile/">{% trans "Settings" %}</a>
        <a href="{{ SITE_ROOT }}" title="{% trans "Exit System Admin" %}" class="item">{% trans "Exit System Admin" %}</a>
        <a href="{{ SITE_ROOT }}accounts/logout/" class="item" id="logout">{% trans "Log out" %}</a>
    </div>
</script>

<script type="text/template" id="group-member-item-tmpl">
    <td><img src="<%= avatar_url %>" alt="" width="20" class="avatar" /></td>
    <td><a href="<%= user_info_url %>"><%- name %></a></td>
    <td>
        <% if (role == 'Owner') { %>
        <span class="cur-role">{% trans "Owner" %}</span>
        <% } else if (role == 'Admin') { %>
        <span class="cur-role">{% trans "Admin" %}</span>
        <span title="{% trans "Edit" %}" class="user-role-edit-icon sf2-icon-edit op-icon vh"></span>
        <select name="role" class="user-role-select hide">
            <option value="0">{% trans "Member" %}</option>
            <option value="1" selected="selected">{% trans "Admin" %}</option>
        </select>
        <% } else if (role == 'Member') { %>
        <span class="cur-role">{% trans "Member" %}</span>
        <span title="{% trans "Edit" %}" class="user-role-edit-icon sf2-icon-edit op-icon vh"></span>
        <select name="role" class="user-role-select hide">
            <option value="0" selected="selected">{% trans "Member" %}</option>
            <option value="1">{% trans "Admin" %}</option>
        </select>
        <% } %>
    </td>
    <td> 
        <% if (role != 'Owner') { %>
        <a href="#" class="sf2-icon-delete sf2-x member-delete-btn op-icon vh" title="{% trans "Delete" %}" aria-label="{% trans "Delete" %}"></a>
        <% } %>
    </td>
</script>

<script type="text/template" id="add-group-member-form-tmpl">
    <form id="add-group-member-form" action="" method="post" class="hide">{% csrf_token %}
        <h3 id="dialogTitle">{% trans "Add Member" %}</h3>
        <label for="email">{% trans "User" %}</label><br />
        <input type="text" name="email" value="" id="email" /><br />
        <p class="error hide"></p>
        <input type="submit" class="submit" value="{% trans "Submit" %}" />
    </form>
</script>

{# address book #}
<script type="text/template" id="address-book-tmpl">
    <div class="hd ovhd">
        <h3 class="fleft">{% trans "Departments" context "address book" %}</h3>
        <div class="fright">
            <button class="btn-white js-add-group">{% trans "New Department" %}</button>
        </div>
    </div>
    <span class="loading-icon loading-tip"></span>
    <table>
        <thead>
            <tr>
                <th width="40%">{% trans "Name" %}</th>
                <th width="25%">{% trans "Created At" %}</th>
                <th width="20%">{% trans "Quota" %}</th>
                <th width="15%"><!--Operations--></th>
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
    <div class="empty-tips hide">
        <h2 class="alc">{% trans "No departments" %}</h2>
    </div>
    <p class="error error-tip hide"></p>
</script>
<script type="text/template" id="address-book-group-tmpl">
    <div class="hd">
        <h3 class="group-path"></h3>
    </div>
    <span class="loading-icon loading-tip"></span>
    <div class="groups">
        <div class="small-hd">
            <h4 class="small-hd-heading">{% trans "Sub-departments" %}</h4>
            <button class="btn-white js-add-group">{% trans "New Sub-department" %}</button>
        </div>
        <table class="hide">
            <thead>
                <tr>
                    <th width="40%">{% trans "Name" %}</th>
                    <th width="25%">{% trans "Created At" %}</th>
                    <th width="25%">{% trans "Quota" %}</th>
                    <th width="10%"><!--Operations--></th>
                </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
        <p class="empty-tip hide">{% trans "No sub-departments" %}</p>
    </div>
    <div class="members">
        <div class="small-hd">
            <h4 class="small-hd-heading">{% trans "Members" %}</h4>
            <button class="btn-white js-add-member">{% trans "Add Member" %}</button>
        </div>
        <table class="hide">
            <thead>
                <tr>
                    <th width="5%"></th>
                    <th width="50%">{% trans "Name" %}</th>
                    <th width="35%">{% trans "Role" %}</th>
                    <th width="10%"><!--Operations--></th>
                </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
        <p class="empty-tip hide">{% trans "No members" %}</p>
    </div>
    <div class="libraries">
        <div class="small-hd">
            <h4 class="small-hd-heading">{% trans "Libraries" %}</h4>
            <button class="btn-white js-add-library">{% trans "New Library" %}</button>
        </div>
        <table class="hide">
            <thead>
                <tr>
                    <th width="5%"></th>
                    <th width="55%">{% trans "Name" %}</th>
                    <th width="30%">{% trans "Size" %}</th>
                    <th width="10%"><!--Operations--></th>
                </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
        <p class="empty-tip hide">{% trans "No libraries" %}</p>
    </div>
    <p class="error error-tip hide"></p>
</script>
<script type="text/template" id="address-book-group-path-tmpl">
    <a href="#address-book/" class="normal">{% trans "Departments" context "address book" %}</a>
    <span class="path-split">/</span>
    <% for (var i = 0,len = ancestor_groups.length; i < len; i++) { %>
    <a href="#address-book/groups/<%= ancestor_groups[i].id %>/" class="normal"><%- ancestor_groups[i].name %></a>
    <span class="path-split">/</span>
    <% } %>
    <%- name %>
</script>
<script type="text/template" id="address-book-group-item-tmpl">
    <td><a href="#address-book/groups/<%= id %>/"><%- name %></a></td>
    <td><time title="<%= time %>"><%= time_from_now %></time></td>
    <td>
        <span <% if (quota_error) { %>class="error"<% } %>><%= quota_shown %></span>
        <span title="{% trans "Edit Quota" %}" class="quota-edit-icon sf2-icon-edit op-icon vh"></span>
    </td>
    <td>
        <a href="#" class="sf2-icon-delete sf2-x group-delete-btn op-icon vh" title="{% trans "Delete" %}" aria-label="{% trans "Delete" %}"></a>
    </td>
</script>
<script type="text/template" id="address-book-group-add-form-tmpl">
    <form id="group-add-form" action="" method="post" class="hide">{% csrf_token %}
        <h3 id="dialogTitle"><%= title %></h3>
        <label for="group-name">{% trans "Name" %}</label><br />
        <input type="text" name="group_name" value="" class="input" id="group-name" /><br />
        <p class="error hide"></p>
        <input type="submit" class="submit" value="{% trans "Submit" %}" />
    </form>
</script>
<script type="text/template" id="address-book-group-quota-set-form-tmpl">
<form id="set-quota-form" method="post" action="" class="hide">{% csrf_token %}
    <h3>{% trans "Set quota" %}</h3>
    <input type="text" name="quota" class="input" /> MB
    <p class="tip">
        <span>{% trans "An integer that is greater than 0 or equal to -2." %}</span><br />
        <span>{% trans "Tip: -2 means no limit." %}</span>
    </p>
    <p class="error hide"></p>
    <input type="submit" value="{% trans "Submit" %}" class="submit" />
</form>
</script>
<script type="text/template" id="address-book-group-library-item-tmpl">
    <td>
        <img src="<%= icon_url %>" title="<%= icon_title %>" alt="<%= icon_title %>" width="24" />
    </td>
    <td>
        <% if (enable_sys_admin_view_repo && is_pro && !encrypted) { %>
        <a href="#libs/<%= repo_id %>/"><%- name %></a>
        <% } else { %>
        <%- name %>
        <% } %>
    </td>
    <td><%- formatted_size %></td>
    <td>
        <a href="#" class="sf2-icon-delete sf2-x repo-delete-btn op-icon vh" title="{% trans "Delete" %}" aria-label="{% trans "Delete" %}"></a>
    </td>
</script>
<script type="text/template" id="address-book-library-add-form-tmpl">
    <form id="library-add-form" action="" method="post" class="hide">{% csrf_token %}
        <h3 id="dialogTitle">{% trans "New Library" %}</h3>
        <label for="library-name">{% trans "Name" %}</label><br />
        <input type="text" name="library_name" value="" class="input" id="library-name" /><br />
        <p class="error hide"></p>
        <input type="submit" class="submit" value="{% trans "Submit" %}" />
    </form>
</script>
